<script setup lang="ts">
import useStore from '@/store';
import { storeToRefs } from 'pinia';
const { editor } = useStore();
const { selectText } = editor
const { list, showList, nowTextId, text } = storeToRefs(editor);
const handleSelectText = (idx: number, id: number) => {
	selectText(id, idx);
	setTimeout(() => { showList.value = false }, 50);
}
</script>

<template>
	<el-dialog title="文章列表" v-model="showList">
		<ul class="text-list">
			<li v-for="(item, index) in list" :key="index">
				<a href="javascript:;" @click="handleSelectText(index, item.id)">
					<div><b>标题： {{ item.title }}</b></div>
					<div>创建日期：{{ item.date }}</div>
				</a>
			</li>
		</ul>
	</el-dialog>
</template>

<style scoped lang="scss">
@import "@/assets/global";

.text-list {
	padding: 0;
	max-height: 478px;
	overflow-y: auto;

	li {
		list-style: none;
		border-bottom: 1px solid #ddd;
		margin-bottom: 25px;
		padding: 0 15px 25px 15px;

		a {
			@include goodA;
		}
	}
}
</style>